<template>
  <div>
    <div class="title">
      <h6></h6>
      工商信息
    </div>
    <div class="f2_f1" v-if="enterpriseInformation">
      <div class="details">
        <div class="details-item">
          <div class="details-item-left">
            <ul>
              <li>企业名称：</li>
              <li>法定代表人：</li>
              <li>经营状态：</li>
              <li>注册资本：</li>
              <li>营业期限自：</li>
              <li>核准日期：</li>
              <li>所属行业：</li>
              <li>登记注册类型：</li>
            </ul>
            <div>
              <p style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis">
                {{ enterpriseInformation.name | getData }}
              </p>
              <p>{{ enterpriseInformation.opername | getData }}</p>
              <p>{{ enterpriseInformation.newstatus | getData }}</p>
              <p>{{ enterpriseInformation.registcapi | getData }}</p>
              <p>
                {{ enterpriseInformation.startdate | getData }}
              </p>
              <p>{{ enterpriseInformation.checkdate | getData }}</p>
              <p>{{ enterpriseInformation.domain | getData }}</p>
              <p>{{ enterpriseInformation.econkind | getData }}</p>
            </div>
          </div>
          <div class="details-item-left">
            <ul>
              <li>统一社会信用代码：</li>
              <li>成立日期：</li>
              <li>曾用名：</li>
              <li>实缴资本：</li>
              <li>营业期限至：</li>
              <li>注册号：</li>
              <li>企业类型：</li>
              <li>地址：</li>
            </ul>
            <div>
              <p>{{ credit_no | getData }}</p>
              <p>{{ enterpriseInformation.startdate | getData }}</p>
              <p>{{ enterpriseInformation.historynames | getData }}</p>
              <p>{{ enterpriseInformation.actualcapi | getData }}</p>
              <p>{{ enterpriseInformation.termend | getData }}</p>
              <p>{{ enterpriseInformation.regno | getData }}</p>
              <p>{{ enterpriseInformation.econkind | getData }}</p>
              <p style="width: 1.3021rem">
                {{ enterpriseInformation.address | getData }}
              </p>
            </div>
          </div>
        </div>
        <div class="manage">
          <h4>经营范围：</h4>
          <p class="manage_p">
            {{ enterpriseInformation.scope }}
          </p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import { myPostFetch } from '@/api/report'
export default {
  props: {
    credit_no: String,
    name: String
  },

  data() {
    return {
      enterpriseInformation: null,
      pageNum: 1,
      pageSize: 10,
      pages: 1,
      list: null
    }
  },
  // 过滤器
  filters: {
    getArea: function (value) {
      value = parseFloat(value)
      if (value == 0) return '-'
      if (!value) return '-'
      // 将数值截取，保留两位小数
      value = value.toFixed(2)
      // 获取整数部分
      const intPart = Math.trunc(value)
      // 整数部分处理，增加,
      const intPartFormat = intPart.toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,')
      // 预定义小数部分
      let floatPart = '.00'
      // 将数值截取为小数部分和整数部分
      const valueArray = value.toString().split('.')
      if (valueArray.length === 2) {
        // 有小数部分
        floatPart = valueArray[1].toString() // 取得小数部分
        return intPartFormat + '.' + floatPart
      }
      return intPartFormat + floatPart
    },
    getDate: function (value) {
      if (!value) return '-'
      let date = value.split(' ')[0]
      return date
    },
    getData: function (value) {
      if (!value || value == '') {
        return '-'
      } else {
        return value
      }
    }
  },
  mounted() {
    this.findkjapply()
  },
  methods: {
    // 获取信息
    async findkjapply() {
      let url = '/credit/creditinfo'
      let params = {
        n: this.name,
        pageNum: this.pageNum,
        pageSize: this.pageSize,
        pages: 1
      }
      let data = await myPostFetch(url, params)
      this.enterpriseInformation = data.base
    },
    //点击下一页
    nextClick() {
      this.pageNum += 1
      this.findkjapply()
    },
    //点击上一页
    prevClick() {
      this.pageNum -= 1
      this.findkjapply()
    },
    //点击数字改变page的值
    handlePageChange(currentPage) {
      this.pageNum = currentPage
      this.findkjapply()
    }
  }
}
</script>

<style lang="scss" scoped>
ul {
  list-style: none;
}
.title {
  display: flex;
  align-items: center;
  box-sizing: border-box;
  font-size: 0.0938rem;
  font-weight: bold;
  color: #333333;
  h6 {
    width: 0.026rem;
    height: 0.0938rem;
    background-color: #0a7be0;
    margin-right: 0.0521rem;
  }
}
// 信息
.f2_f1 {
  box-sizing: border-box;
  background: #ffffff;
  .details {
    box-sizing: border-box;
    padding: 0 0.1042rem;
    width: 100%;
    .details-item {
      display: flex;
      // justify-content: space-between;
      width: 100%;
      .details-item-left {
        display: flex;
        height: 100%;
        margin-right: 0.9896rem;
        ul {
          width: 0.7292rem;
          height: 100%;
          font-size: 0.0729rem;
          font-family: Source Han Sans SC;
          font-weight: 400;
          color: #666666;
          li {
            margin-top: 0.0781rem;
          }
        }
        div {
          height: 100%;
          // overflow: hidden;
          // white-space: nowrap;
          // text-overflow: ellipsis;
          z-index: 99;
          p {
            width: 1.4583rem;
            margin-top: 0.0781rem;
            font-size: 0.0729rem;
            font-family: Source Han Sans SC;
            font-weight: 400;
            color: #333333;
          }
        }
      }
    }
    .manage {
      margin-top: 0.1042rem;
      box-sizing: border-box;
      padding: 0.0781rem 0;
      display: flex;
      width: 100%;
      height: 100%;
      font-size: 0.0677rem;
      font-family: Source Han Sans SC;
      font-weight: 400;
      color: #666666;
      h4 {
        width: 0.7292rem;
        color: #666666;
        font-weight: 400;
        font-size: 0.0729rem;
      }
    }
    .manage_p {
      flex: 1;
      font-size: 0.0729rem;
      font-family: Source Han Sans SC;
      font-weight: 400;
      color: #333333;
      // line-height: 30px;
    }
  }
}
.content {
  position: relative;
  box-sizing: border-box;
  background: #ffffff;
  margin-top: 0.1042rem;
  // 表格
  .table {
    box-sizing: border-box;
    width: 100%;
    background-color: #fff;
    height: 100%;
    margin-bottom: 0.1042rem;
    cursor: pointer;
    overflow: auto;
    .span {
      display: inline-block;
      font-size: 0.0781rem;
      font-family: Source Han Sans SC;
      font-weight: 400;
      margin-right: 0.026rem;
      color: #ccc;
      border-bottom: 0.0052rem solid #ccc;
      cursor: pointer;
      margin-right: 0.0521rem;
    }
    .span1 {
      display: inline-block;
      font-size: 0.0781rem;
      font-family: Source Han Sans SC;
      font-weight: 400;
      margin-right: 0.026rem;
      color: #3f6ef2;
      border-bottom: 0.0052rem solid #3f6ef2;
      cursor: pointer;
    }
    .nactive {
      font-size: 0.0729rem;
      margin-right: 0.026rem;
      color: #3f6ef2;
      border-bottom: 0.0052rem solid #3f6ef2;
    }
    .state-bar {
      span {
        font-size: 0.0729rem;
        font-family: Source Han Sans SC;
        font-weight: 400;
        color: #606266;
        margin-right: 0.0521rem;
      }
    }
  }
  // 分页器
  .pagination {
    display: flex;
    justify-content: right;
    margin-top: -0.1042rem;
    // right: 0.1042px;
    span {
      font-size: 0.0833rem;
      font-family: Source Han Sans SC;
      font-weight: 400;
      color: #666666;
      margin-top: 0.0104rem;
    }
  }
}
::v-deep .el-table th.el-table__cell > .cell {
  text-align: center;
}
// 表格样式
::v-deep .el-table th.el-table__cell > .cell {
  font-size: 0.0833rem;
}
::v-deep.el-pagination {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.0781rem;
  font-size: 0.0833rem;
  font-family: Source Han Sans SC;
  font-weight: 400;
  color: #666666;
}
/* 表格 */
::v-deep .el-table {
  th.el-table__cell > .cell {
    font-size: 0.0781rem;
    font-weight: 400;
  }
  .cell {
    font-size: 0.0781rem;
  }
  .el-table__body-wrapper {
    overflow: auto;
    height: calc(100% - 85px);
    &::-webkit-scrollbar {
      width: 0; /* 纵向滚动条 宽度 */
      height: 0.0781rem; /* 横向滚动条 高度 */
    }
    &::-webkit-scrollbar-thumb {
      width: 0.0521rem; /* 横向滚动条 宽度 */
      height: 0.0781rem; /* 纵向滚动条 高度 */
      background-color: rgb(167, 164, 164);
    }
  }
}
</style>
<style lang="scss">
/* 分页器 */
.el-pagination.is-background .el-pager li {
  border-radius: 0.1042rem;
}
.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #3f6ef2;
}

.el-pagination.is-background .btn-next,
.el-pagination.is-background .btn-prev,
.el-pagination.is-background .el-pager li {
  background-color: transparent;
}

.el-table tr {
  height: 0.2083rem;
}
.el-table .el-table thead {
  height: 0.2083rem;
}

.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: #3f6ef2;
}
</style>
